<template>
	<view>
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft" style="overflow: auto hidden;">
				<uni-view class="flex text-center">
				<view class="cu-item flex-sub" :class="index == TabCur?'text-blue cur':''" v-for="(item,index) in navTop" :key="index" @tap="tabSelect"
				 :data-id="index">
					{{item.title}}
				</view>
				</uni-view>
			</scroll-view>
		<uni-view class="cu-form-group">
		  <uni-view class="title">问诊时间</uni-view>
		  <uni-view class="action" style="color: #F29100;">待完成</uni-view>
		 </uni-view>
		 <uni-view class="cu-list menu-avatar" >
		      <uni-view class="cu-item" style="border-top: 1px solid rgba(192,192,192,0.5);height: 100px;">
		        <uni-view class="cu-avatar round lg"
		          style='background-image: url(../../static/me/head.png);'>
		        </uni-view>
		        <uni-view class="content">
		          <uni-view class="text-black">
		            <uni-text class="text-cut"><span>紫色病人</span></uni-text>
		            <uni-view class="cu-tag round bg-orange sm">男</uni-view>
					<uni-view class="cu-tag round bg-blue sm">131岁</uni-view>
		          </uni-view>
		          <uni-view class="text-gray text-sm flex">
		            <uni-text class="text-cut">
		              <span>配药：66666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666</span>
		            </uni-text>
		          </uni-view>
		        </uni-view>
		      </uni-view>
		 </uni-view>
		 <uni-view class="cu-form-group">
		   <uni-view class="title">复诊配药</uni-view>
		   <uni-view class="action cu-tag line-green" >完成接诊</uni-view>
		  </uni-view>
		 <uni-view class="cu-form-group margin-top">
		   <uni-view class="title">问诊时间</uni-view>
		   <uni-view class="action" style="color: #F29100;">待完成</uni-view>
		  </uni-view>
		  <uni-view class="cu-list menu-avatar" >
		       <uni-view class="cu-item" style="border-top: 1px solid rgba(192,192,192,0.5);height: 100px;">
		         <uni-view class="cu-avatar round lg"
		           style='background-image: url(../../static/me/head.png);'>
		         </uni-view>
		         <uni-view class="content">
		           <uni-view class="text-black">
		             <uni-text class="text-cut"><span>紫色病人</span></uni-text>
		             <uni-view class="cu-tag round bg-orange sm">男</uni-view>
		 			<uni-view class="cu-tag round bg-blue sm">131岁</uni-view>
		           </uni-view>
		           <uni-view class="text-gray text-sm flex">
		             <uni-text class="text-cut">
		               <span>配药：66666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666666</span>
		             </uni-text>
		           </uni-view>
		         </uni-view>
		       </uni-view>
		  </uni-view>
		  <uni-view class="cu-form-group">
		    <uni-view class="title">复诊配药</uni-view>
		    <uni-view class="action cu-tag line-green" >完成接诊</uni-view>
		   </uni-view>
	</view>
	
</template>

<script>
	export default {
		data() {
			return {
				TabCur: 0,
				scrollLeft: 0,                                                                    
				navTop:[
					{  
						id: 1,
						title: '未完成'
					},
					{
						id: 2,
						title: '已完成'
					},
				],
			}
		},
		methods: {
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
			},
		}
	}
</script>

<style>

</style>
